
import vnode from "./vnode.js"

import createElement from './createElement.js'

import updateChildren from './updateChildren.js'

export default  function(oldVnode,newVnode){
    if(oldVnode.sel=='' || oldVnode.sel==undefined){
      //传入的第一个参数是ＤＯＭ节点不是虚拟节点
      oldVnode=vnode(oldVnode.tagName.toLowerCase(),{},[],undefined,oldVnode)
       //   console.log(oldVnode)
    }
    //判断 oldVnode 与newVnode 是不是同一个节点
    if(oldVnode.key==newVnode.key && oldVnode.sel==newVnode.sel){
       // console.log('是同一个节点')
        //判断新旧是否是同一个对象
        if(oldVnode==newVnode){
            return
        }
        //判断新newVnode 有没有text属性
        if(newVnode.text != undefined && (newVnode.children==undefined || newVnode.children.length==0 )){
             console.log('新 vnode有text属性')
             if(newVnode.text!=oldVnode.text){
                oldVnode.elm.innerText=newVnode.text
             }
         }else{
            console.log('新 vnode 没有text属性') //新的有children
            if(oldVnode.children!=undefined && oldVnode.children.length>0){
                 //新老都有children 此时就是最复杂的情况
                 updateChildren(oldVnode.elm, oldVnode.children,newVnode.children)
            }else{
                //老的没有  新的有
                oldVnode.elm.innerText=''
                //遍历新vnode的子节点  创建DOM 上树 循环上树的
                for(let aa=0;aa<newVnode.children.length;aa++){
                    let dom=createElement(newVnode.children[aa]) 
                    oldVnode.elm.appendChild(dom)
                }
            }
         }
    }else{
        //不是同一个节点 把原来的干掉  加入新的
        // console.log(oldVnode)
        // console.log(oldVnode.elm)//这里确实是elm
        // console.log(newVnode)
        // createElement(newVnode,oldVnode.elm)
        let newnVodeElm=createElement(newVnode)
        //这里进行插入  进行上树  插入到老节点之前
        if(oldVnode.elm.parentNode && newnVodeElm){
            oldVnode.elm.parentNode.insertBefore(newnVodeElm,oldVnode.elm);//insertBefore要传入2个参数
        }
        //删除老的节点
        oldVnode.elm.parentNode.removeChild(oldVnode.elm)

    }

}